<template>
  <el-dialog
    v-el-drag-dialog
    title="调拨单信息"
    :visible.sync="visible"
    width="800px"
  >
    <el-table
      :data="tableData"
      max-height="300"
      style="width: 100%;"
    >
      <el-table-column
        prop="stockTransCode"
        label="调拨单号"
      />
      <el-table-column
        prop="outStoreName"
        label="调出仓库"
      />
      <el-table-column
        prop="inStoreName"
        label="调入仓库"
      />
      <el-table-column
        prop="bottleNum"
        label="调拨数量"
      />
      <el-table-column
        prop="transStatus"
        label="状态"
      >
        <template slot-scope="scope">
          <span>{{ scope.row.transStatus ? formatColumnMap(transStatusMap, 'value', scope.row.transStatus, 'desc') : '' }}</span>
        </template>
      </el-table-column>
    </el-table>
    <div slot="footer" class="dialog-footer">
      <el-button @click="visible = false">关闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
  import { stockTransPlanDetail, queryMap } from '@/api'
  import { formatColumnMap } from '@/utils'
  export default {
    name: 'allotInfo',
    data() {
      return {
        formatColumnMap,
        visible: false,
        transStatusMap: [],
        tableData: []
      }
    },
    methods: {
      async open(row) {
        await this.queryOptionsMap()
        return new Promise((resolve) => {
          this.resolve = resolve
          this.visible = true
          this.getDetail(row.id)
        })
      },
      // 查询枚举
      async queryOptionsMap() {
        const [res] = await Promise.all([
          queryMap({ enumName: 'StockTransStatus' })
        ])
        this.transStatusMap = res.data
      },
      async getDetail(id) {
        const res = await stockTransPlanDetail({ id: id })
        this.tableData = res.data.billList
      }
    }
  }
</script>

<style lang="scss" scoped>
</style>
